<template>
<scroll-view class="index_list" :scroll-top='top' :style="height?'height:'+height +' !important':''" :lower-threshold='100' :scroll-y="true"  @scrolltolower='getMore'>
	<view v-if="type_name!='city'" class="" style="font-size: 12px;margin-left: 10px;margin-top: 8px;" v-show="total>0">
		为您找到 <text style="color:red;font-size: 14px;">{{total>=10000?' 10000+ ':(' '+total+' ')}}</text> 
		<text>项产品</text>
	</view>
	<view class="list_item" v-for="(item,index) in list" :key="index" @click="toDetail(item)">
		<view class="flex_sb" style="margin-bottom: 10px;">
			<view class="jr_name">{{item.name}}</view>
			<view class="jr_name_bank">{{item.finance_name}}</view>
		</view>
		<view class="flex_sb"  style="margin-bottom: 4px;">
			<view class="jr_num">{{item.money*1}} <text style="font-size: 12px;">万元</text> </view>
			<view class="jr_text">参考利率 <text>{{item.rate*1}}%</text></view>
		</view>
		<view class="flex_sb">
			<view class="jr_text">贷款额度</view>
			<view class="jr_text">贷款期限 <text>1-{{item.month}}月</text></view>
		</view>
	</view>
	<slot></slot>
</scroll-view>
</template>
<script setup>
const props = defineProps({
	type_name:{
		type:String,
	},
	type_name_a:{
		type:String,
	},
	list:{
		type:Array,
		default:[]
	},
	total:{
		type:Number,
		default:0
	},
	isSmall:{
		type:Boolean,
		default:false
	},
	isYzy:{
		type:Boolean,
		default:false
	},
	height:{
		type:String,
	}
})
var winH = uni.getStorageSync('windowH')
var navH = uni.getStorageSync('navH1')

const style = reactive({
	height:'100%'
})
onMounted(()=>{
	if(!props.height){
		style.height = (winH - 72 - navH)+'px'
	}
})
const emit = defineEmits(["getMore","toDetail"])
const top = ref(0)

watch( () => props.total , (newValue) => {
	top.value = top.value==0?-1:0
})

function getMore(){
	emit("getMore")
}
function toDetail(item){
	uni.navigateTo({
		url:'/pages/jinrongDetail/jinrongDetail?id='+item.id + '&name='+item.name
	})
}
</script>
<style lang="scss" scoped>
.index_list{
	height: calc(100% - 72px);
	position: relative;
	width: 100%;
}
//#ifdef APP-PLUS
.index_list{
	height: v-bind('style.height') !important
}
//#endif
.list_item{
	width: calc(100% - 30px);
	// min-height: 100px;
	padding: 10px;
	border-radius: 8px;
	box-shadow: 0px 1px 10px 0px #0A477519;
	margin: 10px 5px 15px;
	position: relative;
	.img_small{
		height: 40px !important;
		width: 40px !important;
		border-radius: 4px !important;
		text-align: center;
		font-size: 14px !important;
	}
	.img{
		width: 120px;
		height: 90px;
		border-radius: 6px;
		overflow: hidden;
		position: relative;
		box-shadow: 0 0 5px 0 rgba(0, 0,0, 0.1);
		.logo_name{
			height: 100%;
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: center;
			font-weight: bold;
			background: #0091FF;
			color: #fff;
		}
		image{
			width: 100%;
			height: 100%;
		}
		.img_level{
			position: absolute;
			top: 6px;
			left: 0px;
			padding: 2px 8px;
			border-radius: 4px;
			background: linear-gradient(135deg,#0091FF33,#0091FF);
			font-size: 12px;
			color: #fff;
		}
	}
	.right_div_small{
		width: calc(100% - 50px) !important
	}
	.right_div{
		width: calc(100% - 130px);
		.r_title{
			font-size: 16px;
			color: #333;
		}
	}
	.chain_view{
		background-color: #ECF3FF;
		color: #3D7CE2;
		padding: 0 4px;
		height: 16px;
		line-height: 16px;
		border-radius: 2px;
		font-size: 12px;
		margin: 8px 5px 0 0;
		display: inline-block;
	}
	.add_view{
		display: flex;
		font-size: 12px;
		margin-top: 6px;
		color:#999;
		image{
			max-width: 14px;
			min-width: 14px;
			height: 14px;
			margin-right: 6px;
			margin-top: 1px;
		}
	}
	.color_red{
		color: #f1340e;
	}
	.div100{
		width: 100%;
	}
}
.jr_name{
	font-size: 16px;
}
.jr_name_bank{
	color: #0091FF;
	background-color: #0091FF33;
	border-radius: 2px;
	border: 1px silid #0091FF;
	font-size: 12px;
	padding: 0 4px;
	height: 18px;
}
.jr_num{
	font-size: 18px;
	color: #ce1504;
}
.jr_text{
	width: 50%;
	font-size: 14px;
	color: #666;
	text{
		margin-left: 8px;
		color: #000;
	}
}
</style>